<template>
<h1>登录功能</h1>
  <input type="text" placeholder="请输入用户名" v-model="user.username">
  <input type="password" placeholder="请输入密码" v-model="user.password">
  <input type="button" @click="login()" value="登录">
</template>

<script setup>
import {ref} from "vue";
import axios from "axios";
import router from "@/router";

const user=ref({username:"",password:""})
const login=()=>{
  axios.post('http://localhost:8080/v1/users/login',user.value)
    .then((response)=>{
      // response.data = JsonResult {code, msg, data}
      // let jsonResult = response.data;
      // response.data.data;
      if (response.data.code==1){
        alert("登录成功!欢迎"+response.data.data.nickname+"回来!")
        //把需要多个页面共享的数据放在localStorage对象中
        //localStorage只能保存字符串类型的数据,不能保存对象
        // localStorage.user=response.data.data;
        //JSON.stringify把对象转成JSON个数的字符串
        localStorage.user=JSON.stringify(response.data.data);
        router.push('/')
      }else {
        alert(response.data.msg)
      }
    });
}
</script>

<style scoped>

</style>